import React, { useEffect, useState } from 'react'
import Tables from './userSub/Tables'
import { render } from "../../services/user"
import Add from "./userSub/Add"
import Search from "./userSub/Search"
import Update from "./userSub/Updates"


export default function System() {
  let [users, setUsers] = useState([])
  let [type, setType] = useState("")
  let [value, setValue] = useState("")

  //分页
  const [pagination, setPagination] = useState({
    showQuickJumper: true,
    showSizeChanger: true,
    pageSizeOptions: [5, 10, 15, 20],
    total: (total) => `共 ${total} 条`
  })
  const show = async (params = {}) => {
    console.log("params", params);
    if (params.type) {
      setValue(params.value)
      setType(params.type)
    } else {
      params.value = value
      params.type = type
    }

    let res = await render(params)
    console.log(res);
    setUsers(res.rows)
    //将字符串转为数字
    res.current = parseInt(res.current)
    setPagination({ ...pagination, ...res })
    console.log(res);
  }

  //生命周期函数
  useEffect(() => {
    show()
  }, [""]);

  return <div>
    <div style={{ display: "flex", margin: "15px 0 15px 30px" }}>
      <Add show={show}></Add>
      <Search show={show}></Search>
    </div>
    <Update show={show} ></Update>
    <Tables users={users} show={show} pagination={pagination} ></Tables>
  </div>
}
